<ion-header>
  <ion-toolbar>
    <ion-icon name="arrow-back" slot="start" (click)="goBack()"></ion-icon>
    <ion-title>个人信息更改</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>

  <!-- 个人信息 -->
  <ion-item>
    <img class="pic" [src]="PeopleList.img" (click)="logo()" />
  </ion-item>
  <!-- <ion-img [src]="PeopleList.img"></ion-img> -->

  <ion-card>
    <ion-item-divider>
      <ion-label>用户基本信息</ion-label>
    </ion-item-divider>

    <ion-item color="light">  
      <!-- 这里的这个背景色要不要存在 -->
      <ion-label>用户&nbsp;&nbsp;&nbsp;&nbsp;id:&nbsp;&nbsp;</ion-label>
      <ion-input value="Readonly" [(ngModel)]="PeopleList.id" readonly></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>姓&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;名:&nbsp;&nbsp; </ion-label>
      <ion-input [(ngModel)]="PeopleList.userName" required #name="ngModel" clearInput></ion-input>
            <!-- 必填提醒  required #name3="ngModel" -->
            <div *ngIf="name.invalid && (name.dirty || name.touched)" class="alert-danger">  
              <div *ngIf="name.errors.required">
                  必填
              </div>
            </div>
    </ion-item>

    <ion-item-divider>
      <ion-label>性别:</ion-label>
    </ion-item-divider>

    <ion-radio-group [(ngModel)]="PeopleList.sex">
      <ion-item>
        <ion-icon name="man" slot="start" color="secondary"></ion-icon>
        <ion-label>男</ion-label>
        <ion-radio slot="end" value="男"></ion-radio>
      </ion-item>
      <ion-item>
        <ion-icon name="woman" slot="start" color="danger"></ion-icon>
        <ion-label>女</ion-label>
        <ion-radio slot="end" value="女"></ion-radio>
      </ion-item>
    </ion-radio-group>

    <ion-item-divider>
      <ion-label>联系方式:</ion-label>
    </ion-item-divider>

    <ion-item>
      <ion-label>手机号码:&nbsp;&nbsp;</ion-label>
      <ion-input [(ngModel)]="PeopleList.mobile" clearInput></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>邮&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;箱:&nbsp;&nbsp;</ion-label>
      <ion-input [(ngModel)]="PeopleList.email" clearInput></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>地&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;址:&nbsp;&nbsp;</ion-label>
      <ion-input [(ngModel)]="PeopleList.address" clearInput></ion-input>
    </ion-item>

    <ion-item>
      <ion-label>Q&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Q:&nbsp;&nbsp;</ion-label>
      <ion-input [(ngModel)]="PeopleList.property05" clearInput></ion-input>
    </ion-item>
    <br>
    <ion-button class="submit_btn" expand="block" (click)="saveUserInfo()">保存</ion-button>
    <br>
  </ion-card>

</ion-content>